<template>
	<base-page-view class-name="page-container">
		<view class="detail-content">
      <view class="detail-box" v-for="(item,index) in list" :key="index" @click="goDetail(item)">
        <view class="left">
          <view class="title">{{item.title}}</view>
          <view class="time">{{item.incomeDate|formatDate}}</view>
        </view>
        <view class="right">
          <view class="num">{{item.incomeAmount}}</view>
          <view class="num2">剩余:{{item.remainAmount}}</view>
        </view>
      </view>
    </view>
    <no-more :list="list" :nomore="nomore"></no-more>
	</base-page-view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
        pageSize: 20,
        pageNo: 1,
        nomore: false,
			}
		},
    onLoad() {
      this.get_list();
    },
    onPullDownRefresh() {
      this.pageNo = 1
      this.list = []
      this.nomore = false
      this.get_list()
    },
    onReachBottom() {
      if (this.nomore) return
      this.pageNo += 1
      this.get_list()
    },
		methods: {
			async get_list(){
        const res=await this.$api.gainApi.remain_detail({
          pageSize: this.pageSize,
          pageNo: this.pageNo,
          userId:this.userInfo.uid,
        });
        if (res.code === '000000') {
          setTimeout(function() {
            uni.stopPullDownRefresh()
          }, 500)
          this.list = this.list.concat(res.data.list);
          if (res.data.list.length < this.pageSize) {
            this.nomore = true
          }
        }
      },
      goDetail(item){
        let query={
          incomeType:item.incomeType,
          uniqueNo:item.uniqueNo,
          inviteType:item.inviteType
        }
        //提现
        if(item.incomeType=='WITHDRAW'){
          this.$navigateTo(`/pagesEarnings/balance/withdrawDetails?query=${JSON.stringify(query)}`);
        }
        //邀请类型
        else if(item.incomeType=='INVITA'){
          this.$navigateTo(`/pagesEarnings/balance/inviteDetail?query=${JSON.stringify(query)}`);
        }
        else{
          this.$navigateTo(`/pagesEarnings/balance/settleDetail?query=${JSON.stringify(query)}`);
        }
      }
		}
	}
</script>

<style lang="scss" scoped>
.detail-content{
  margin-top: 20rpx;
  background-color: white;
  .detail-box:last-child{
    border-bottom:none;
  }
}
.detail-box{
  display: flex;
  align-items: center;
  padding: 45rpx 0rpx;
  margin: 0rpx 37rpx;
  justify-content: space-between;
  border-bottom: 2rpx solid #EEEEEE;
  .left{
    .title{
      font-size: 28rpx;
      margin-bottom: 15rpx;
    }
    .time{
      color: #999999;
    }
  }
  .right{
    text-align: right;
    .num{
      font-size: 28rpx;
      color: #000000;
      margin-bottom: 15rpx;
    }
    .num2{
      color: #999999;
    }
  }
}
</style>
